<!--系统管理 --- 组织机构 --- 机构管理 -->
<template>
  <div class="department" id="department">
    <!-- 右侧 -->
    <div class="department_right">
      <div class="app-container-btn">
        <el-button type="primary" @click="saveFrom()">保存</el-button>
        <el-button @click="goBack">返回</el-button>
      </div>
      <!-- 表格 -->
      <div class="text_table TensionRealTime">
        <el-table
          ref="multipleTable"
          :data="tableData"
          style="width: 100%"
          height="100%"
          lazy
          :load="treeLoad"
          :tree-props="{ children: 'children', hasChildren: 'fHaschildren' }"
          row-key="fNodeid"
          v-loading="loading"
          element-loading-text="拼命加载中"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.2)"
          :row-class-name="tableRowClassName"
          border
          stripe
          highlight-current-row
          @current-change="handleCurrentChange"
        >
          <el-table-column
            fixed
            type="index"
            label="序号"
            width="50"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="fName"
            label="工程部位"
            min-width="100"
            style="display: flex"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fName">
                {{ scope.row.fName }}
              </a>
            </template>
          </el-table-column>

          <el-table-column
            prop="fStartstationtype"
            label="开始桩号类型"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fStartstationtype">
                {{ scope.row.fStartstationtype }}
              </a>
            </template>
          </el-table-column>

          <el-table-column
            prop="fStartstationkilometers"
            label="开始桩号公里数"
            align="center"
            width="110"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fStartstationkilometers">
                {{ scope.row.fStartstationkilometers }}
              </a>
            </template>
          </el-table-column>

          <el-table-column
            prop="fStartstationmeters"
            label="开始桩号长度(米)"
            align="center"
            width="120"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fStartstationmeters">
                {{ scope.row.fStartstationmeters }}
              </a>
            </template>
          </el-table-column>

          <el-table-column
            prop="fEndstationtype"
            label="结束桩号类型"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fEndstationtype">
                {{ scope.row.fEndstationtype }}
              </a>
            </template>
          </el-table-column>

          <el-table-column
            prop="fEndstationkilometers"
            label="结束桩号公里数"
            align="center"
            width="110"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fEndstationkilometers">
                {{ scope.row.fEndstationkilometers }}
              </a>
            </template>
          </el-table-column>

          <el-table-column
            prop="fEndstationmeters"
            label="结束桩号长度(米)"
            align="center"
            width="120"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fEndstationmeters">
                {{ scope.row.fEndstationmeters }}
              </a>
            </template>
          </el-table-column>

          <!-- <el-table-column
            prop="StationLength"
            label="桩号长度"
            align="center"
            min-width="100"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.StationLength">
                {{ scope.row.StationLength }}
              </a>
            </template>
          </el-table-column> -->

          <el-table-column
            prop="fWbsstructuretype"
            label="结构类型"
            align="center"
            width="110"
          >
            <template slot-scope="scope">
              <a href="javascript:;" :title="scope.row.fWbsstructuretype">
                {{ scope.row.fWbsstructuretype }}
              </a>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
    <messageBox
      :showMsgBox="showMsgBox"
      :msgTip="msgTip"
      :msgType="msgType"
      @confirmMsg="confirmMsg"
      @confirmMsgs="confirmMsgs"
    ></messageBox>
  </div>
</template>

<script>
import { getWbsList } from "@/api/request.js";
import messageBox from "@/components/public/messageBox"; //弹框

export default {
  name: "Tension_task_list_tree",
  computed: {},
  data() {
    return {
      name: "Tension_task_list_tree",
      // 弹框
      showMsgBox: false,
      msgTip: "请先选择数据",
      msgType: 1,
      // 弹框

      tableData: [],
      loading: false,
      formLabelWidth: "90px",
      fCompanyid: "", //当前行的机构id
      fParentid: "", //父级id
      WbsRow: null, //选中行
      token: "", //获取token
      companyTree: [],
      formData: null,
    };
  },
  components: {
    messageBox,
  },
  created() {},
  mounted() {
    this.companyTree = [];
    this.getToken();
    // this.btnRole(this.name);
  },
  // beforeRouteLeave(to, form, next) {
  //   to.meta.keepAlive = true;
  //   next(0);
  // },
  methods: {
    goBack() {
      this.$router.back();
    },
    // 不带功能的确定、取消按钮
    confirmMsg() {
      this.showMsgBox = false;
    },
    // 带功能确定
    confirmMsgs() {},
    saveFrom() {
      if (this.WbsRow != null) {
        // if (this.WbsRow.fHaschildren == 0) {
        if (this.$route.query.text == "张拉-任务单下发") {
          this.$router.push({
            path: "/tensionManage/tensionTaskListDetails",
          });
          window.sessionStorage.setItem(
            "GxEmbedded_Tension_Wbs_Deta",
            JSON.stringify(this.WbsRow)
          );
          if (JSON.parse(sessionStorage.getItem("GxEmbedded_TWbsQuery"))) {
            var query = {
              fId: "",
              fCompanyid: JSON.parse(
                sessionStorage.getItem("GxEmbedded_TWbsQuery")
              ).fCompanyid,
              num: "改变",
            };
            window.sessionStorage.setItem(
              "GxEmbedded_TWbsQuery",
              JSON.stringify(query)
            );
          }
        } else if (this.$route.query.text == "砼-配合比") {
          this.$router.push({
            path: "/hntManage/hntMixProportionDetail",
            status: 1,
          });
          window.sessionStorage.setItem(
            "GxEmbedded_coordinate_Wbs_Deta",
            JSON.stringify(this.WbsRow)
          );
        }

        // } else {
        //   this.$MessageBox.alertConfirmReminder("请选中最底层节点！");
        // }
      } else {
        // this.$MessageBox.alertConfirmReminder("请先选择数据");
        this.msgTip = "请先选择数据，再保存";
        this.msgType = 1; // 0 带功能确定  1 无功能确定  2 带功能确定、取消
        this.showMsgBox = true;
      }
    },
    // 行颜色
    tableRowClassName({ row }) {
      if (
        (row.fParentid == 0 && !row.children) ||
        (row.fParentid == null && !row.children)
      ) {
        return "fristColor";
      }
    },

    async getToken() {
      await this.$http(
        " http://172.18.5.31:8300/IOTManagement/roadApi/getToken.do"
      ).then((res) => {
        if (res.status == 200) {
          // window.sessionStorage.setItem("GxEmbedded_token", JSON.stringify(token));
          localStorage.setItem(
            "GxEmbedded_token",
            res.data.data.Authorizations
          );
          if (this.$route.query.text == "张拉-任务单下发") {
            this.getWbsDataFun(this.$route.query.secId.fCompanyid, "");
          } else if (this.$route.query.text == "砼-配合比") {
            if (
              JSON.parse(sessionStorage.getItem("GxEmbedded_HntMixProportion"))
            ) {
              var Fdata = JSON.parse(
                sessionStorage.getItem("GxEmbedded_HntMixProportion")
              );
              this.getWbsDataFun(Fdata.fCompanyid, "");
            }
          }
        }
      });
    },
    getWbsDataFun(id, num) {
      this.loading = true;
      this.tableData = [];
      getWbsList({
        fCompanyid: id, //云检的标段Id
        fNodeId: num, //WBS节点Id（对应返回数据中的NodeId字段），该参数可以不传或为空（不传或为空代表的是获取第一层的WBS数据），如果该参数传了值，则代表的是获取该节点的下一层的所有数据
        keyWord: "", //工程部位查询关键字
      })
        .then((res) => {
          if (res.errcode == 0) {
            this.tableData = res.data.data;
            // console.log(0, this.tableData);
            this.loading = false;
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((error) => {
          this.$message.error(error.msg);
          this.loading = false;
        });
    },

    treeLoad(tree, treeNode, resolve) {
      getWbsList({
        fCompanyid: this.$route.query.secId.fCompanyid, //云检的标段Id
        fNodeId: tree.fNodeid, //WBS节点Id（对应返回数据中的NodeId字段），该参数可以不传或为空（不传或为空代表的是获取第一层的WBS数据），如果该参数传了值，则代表的是获取该节点的下一层的所有数据
        keyWord: "", //工程部位查询关键字
      })
        .then((res) => {
          if (res.errcode == 0) {
            return resolve(res.data.data);
          } else {
            this.$message.error(res.msg);
          }
        })
        .catch((error) => {
          this.$message.error(error.msg);
          this.loading = false;
        });
    },

    // 点击当前行变色
    handleCurrentChange(val) {
      this.WbsRow = val;
    },
  },
};
</script>

<style scoped lang='less'>
a {
  text-decoration: none;
  color: #000;
}
</style>